<template>
    <div>
    <van-nav-bar
      :title="$route.name"
      @click-left="$router.back()"
      left-text="返回"
      left-arrow
      right-text="登录"
      @click-right="$router.push('/login')"
    />
    <!-- 输入表单 -->
    <van-form @submit="register">
  <van-field
    v-model="reglist.phone"
    name="手机号"
    label="手机号"
    placeholder="请输入手机号"
    :rules="[{ required: true, message: '请输入手机号' }]"
  />
    <van-field
    v-model="reglist.nickname"
    name="昵称"
    label="昵称"
    placeholder="请输入昵称"
    :rules="[{ required: true, message: '请输入昵称' }]"
  />
  <van-field
    v-model="reglist.password"
    type="password"
    name="密码"
    label="密码"
    placeholder="密码"
    :rules="[{ required: true, message: '请填写密码' }]"
  />
  <div style="margin: 16px;">
    <van-button round block type="info" native-type="submit">注册</van-button>
  </div>
</van-form>
    </div>
</template>

<script>
import {Toast} from 'vant'
import {register} from '../request/api'
export default {
    data() {
        return {
            reglist:{
                phone:'',
                nickname:'',
                password:''
            }
        };
    },
    methods: {
        //封装一个注册事件
        register(){
            register(this.reglist)
            .then(res=>{
                console.log(res,'注册');
                if(res.data.code==200){
                    this.$router.push('/login')
                    Toast.success(res.data.msg)
                }else{
                    Toast.fail(res.data.msg)
                }
            })
            
        }
    },
};
</script>

<style  scoped>

</style>
